html {
	margin:0;
	padding:0;
	font-family:Arial, Helvetica, sans-serif;
	color:#000;
}

body {
	margin:0;
	background-color:#FFF;
	font-size:13px;
}

p, div, h1, h2, h3, table, tbody, tr, td, form {
	margin:0;
	padding:0;
}

.small {
	font-size:10px;
}

.white {
	color:#FFF;
}

.lightGray {
	color:#CCC;
}

.midGray {
	color:#666;
}

.darkGray {
	color:#999;
}

.black {
	color:#000;
}

.left {
	float:left;
}

.right {
	float:right;
}

table.inputs {
}

table.submitControls {
	width:100%;
	margin:5px 0 0 0;
}

h1 {
	font-size:28px;
	font-weight:normal;
}

h2 {
	font-size:20px;
	font-weight:normal;
}

/*
h3 {
	font-size:20px;
	font-weight:normal;
}
*/

a, a img {
	border:none;
}

a:link {
	color:#006699;
	/*
	color:#00E9C1;
	*/
	/*
	color:#67CBFD;
	*/
}

a:active {
	color:#006699;
}

a:visited {
	color:#0099cc;
}

/*
a:hover {
	color:#000;
}
*/

img.tile {
	width:128px;
	height:128px;
}

img.magTile {
	width:2048px;
	height:2048px;
}

/*
#headerContainer {
	width:916px;
	height:164px;
	z-index:1;
	position:relative;
	color:#000;
}
*/

#headerContainer {
	height:143px;
}

#headerContainer img {
	float:left;
}

#headerContainer div.tableContainer {
	padding:85px 0 0 159px;
}

/*
#linkContainer {
	position:absolute;
	top:5px;
	right:5px;
}

#linkContainer table p {
	margin:0 10px 0 0;
}

#linkContainer a:link {
	color:#33CCFF;
}

#linkContainer a:hover {
	color:#000;
}
*/

#headerContainer p.title {
	width:508px;
	font-size:22px;
	font-weight:bold;
}

.subtitle {
	font-size:11px;
}

#revealContainer {
	position:absolute;
	top:159px;
	left:16px;
	display:none;
}

div.tableContent {
	margin:0 10px 5px 0;
	padding:0 5px;
}

div.rightTableContent {
	margin:0 0 24px 0;
}

#buttonContainer {
	margin:12px 0 0 0;
	text-align:center;
}

#buttonContainer.home {
	background-image:url(../images/cluster1.jpg);
	background-position:207px 0px;
	background-repeat:no-repeat;
}

#buttonContainer.about {
	background-image:url(../images/cluster2.jpg);
	background-position:0px 22px;
	background-repeat:no-repeat;
}

#buttonContainer.faq {
	background-image:url(../images/cluster3.jpg);
	background-position:218px 22px;
	background-repeat:no-repeat;
}

#copyContainer {
	margin:0 16px 0 0;
}

#copyContainer p {
	padding: 0 0 16px 0;
}

#copyContainer p.link {
	padding:0 0 5px 0;
}

#vidContainer {
	margin:20px 0 0 0;
	padding:0;
	text-align:center;
}

#linkContainer {
	padding:0 0 64px 0;
}

#linkContainer.home {
	background-image:url(../images/cluster3.jpg);
	background-position:2px 164px;
	background-repeat:no-repeat;
}

#linkContainer.about {
	background-image:url(../images/cluster1.jpg);
	background-position:172px 160px;
	background-repeat:no-repeat;
}

#linkContainer.faq {
	background-image:url(../images/cluster2.jpg);
	background-position:86px 162px;
	background-repeat:no-repeat;
}

#linkContainer p {
	padding: 0 0 5px 0;
}

#socialContainer {
}

#socialContainer p {
	padding: 0 0 5px 0;
}

#container {
	padding:0 5px 0 0;
	width:891px;
}

#footerContainer {
	margin:40px 0 0 16px;
	padding:0 5px;
	width:881px;
	height:32px;
	background-color:#000;
	background-image:url(../images/footer.jpg);
	background-repeat:no-repeat;
}

#footerContainer p {
	padding:8px 0 0 5px;
	float:right;
	color:#FFF;
}

/*
#footerContainer {
	margin:0 0 0 20px;
	width:896px;
	z-index:1;
	position:relative;
	top:-60px;
	color:#000;
	z-index:1;
	text-align:right;
}

#footerContainer img {
	float:right;
}

#footerContainer p {
	margin:0 20px 0 0;
	padding:20px 0 0 0;
}

#footerContainer a:hover {
	color:#000;
}
*/

/*
#footerContainer {
	position:absolute;
	bottom:0px;
	right:0px;
	color:#666;
	text-align:right;
}

#footerContainer p {
	margin:15px 0 0 0;
	font-family:"Times New Roman", Times, serif;
	font-size:14px;
}

#footerContainer a:hover {
	color:#000;
}
*/

/*
	Remember to change the VIEWPORT_BORDER variable if the border property here changes!!!
*/

#viewport {
	margin:0;
	padding:0;
	width:50px;
	height:50px;
	position:absolute;
	left:-1000px;
	top:-1000px;
	overflow:hidden;
	background-color:#FFF;
	border:1px solid #FFF;
	z-index:16;
	display:none;
	filter:alpha(opacity=94);
	opacity:.94;
}

/*
#viewContainer {
	position:absolute;
	top:0;
	left:0;
}
*/

/*
	This is the border around the area in the viewport representing the
	pixel that the mouse is currently over. Requires z-index to be above the 
	tiles in the mag container. Top and left are set by startApp().
*/

#magSelect {
	width:16px;
	height:16px;
	position:relative;
	border:1px solid #FFF;
	z-index:1;
}

#viewportTag {
	width:170px;
	position:absolute;
	left:-1000px;
	top:-1000px;
	display:none;
	overflow:hidden;
	background-color:#797979;
	/*
	border:1px solid #FFF;
	*/
	border:1px solid #333;
	filter:alpha(opacity=90);
	opacity:.90;
	z-index:15;
	color:#FFF;
	font-size:15px;
}

#clickTag {
	margin:4px 7px;
}

#entryMask {
	width:896px;
	height:768px;
	position:absolute;
	top:0px;
	left:0px;
	z-index:20;
	background-color:#000;
	filter:alpha(opacity=0);
	opacity:0;
	display:none;
	cursor:pointer;
}

#entryTag {
	margin:5px 15px 10px 15px;
	display:none;
}

#entryTag table td.text {
	text-align:right;
}

#completeTag {
	margin:5px 15px 10px 15px;
	display:none;
}

#viewContainer {
	margin:0;
	padding:0;
	position:absolute;
}

#viewContainer img {
	margin:0;
	padding:0;
	border:none;
	position:absolute;
}

#controlContainer {
	width:200px;
	height:150px;
	position:absolute;
	right:10px;
	top:10px;
	text-align:right;
	font-size:11px;
	color:#FFF;
	z-index:3;
	background-color:#222;
	display:none;
}

#controlContainer input, #controlContainer select {
	margin:0;
	padding:0;
	font-size:10px;
}

#controlContainer p.controlItem {
	margin:0 0 10px 0;
}

#eventHandler {
	width:896px;
	height:768px;
	position:relative;
	top:0px;
	left:0px;
	z-index:18;
	background-color:#000;
	filter:alpha(opacity=0);
	opacity:0.0;
	cursor:crosshair;
}

p.submissionHandler {
	width:10px;
	height:10px;
	position:absolute;
	
	/*
	filter:alpha(opacity=0);
	opacity:0.0;
	*/
	z-index:18;
	border:none;
	cursor:crosshair;
}

/*
	Remember to change the CONTAINER_MARGIN_X/Y variables if the margin property here changes!!!
*/

#sampleContainer {
	width:896px;
	height:768px;
	position:absolute;
	top:0px;
	left:0px;
	z-index:6;
	color:#FFF;
	font-size:10px;
	/*
	overflow:hidden;
	*/
}

#sampleContainer div.sampleText {
	position:absolute;
}

#tileContainer {
	/*
	margin:10px 0 0 10px;
	*/
	padding:0;
	width:896px;
	height:768px;
	position:absolute;
	top:0px;
	left:0px;
	background-color:#000;
	z-index:5;
	/*
		Sky image for positioning menu container
	background-image:url(../images/testTiles/sky_1024x768_300.jpg);
	background-image:url(../images/testImages/progressionTest_16x307.jpg);
	*/

}

#tileContainer img {
	margin:0;
	padding:0;
	border:none;
	position:absolute;
}


#logContainer {
	margin:0 0 5px 5px;
	width:500px;
	position:absolute;
	left:0;
	bottom:0;
	color:#000;
	background-color:#DDD;
	z-index:100;
}

#logTitle {
	padding:0 0 0 5px;
	font-size:12px;
	font-weight:bold;
	background-color:#AAA
}

#logTitle span.logToggle {
	font-size:10px;
}

#logTitle span.logToggle a {
	cursor:pointer;
}


#logContent {
	overflow-y:scroll;
	height:200px;
}

#logContainer p {
	margin:0;
	padding:0;
	font-size:10px;
}

/* 
	The menu and footer areas are positioned absolutely with respect to the base container, with
	z-index set so as to appear over the tiles. No width or height are set to keep the
	size of the parent div as small as possible (sizes to fit its children), 
	as it obscures the tiles.
*/

#menuContainer {
	margin:0;
	padding:0;
	width:272px;
	height:240px;
	position:absolute;
	
	/* 
		Positions are multiples of 16 so as to line up with
		revealed area on the image for the title.
	*/
	
	top:304px;
	left:32px;
	z-index:19;
	/*
	background-color:#000;
	*/
	/*
	background-image:url(../images/tiles/sky_image_1024x768-WEB_60.jpg);
	*/
	background-image:url(../images/tiles/sky_image_896x768-java-gen-PS.jpg);
	background-position:-32px -304px;
}

#logoContainer {
	width:208px;
	height:80px;
	position:absolute;
	top:304px;
	left:32px;
	padding:0;
	z-index:25;
}

#logoContainer p {
	padding:4px 0 0 4px;
}

#fadeContainer {
	width:896px;
	height:768px;
	position:absolute;
	top:0px;
	left:0px;
	z-index:24;
	background-color:#000;
	filter:alpha(opacity=100);
	opacity:1.0;
}

#menuContainer p.image {
	margin:10px 0 0 10px;
	padding:0;
}

#navContainer {
	margin:5px 0 0 0;
	float:right;
}

#navContainer p {
	padding:0 16px 0 0;
}

#navContainer div.linkMarker {
	margin:0 5px 0 0;
	width:16px;
	height:16px;
	float:left;
}

/*
#linkContainer {
	
}

#linkContainer a {
	color:#000;
}

#linkContainer a:hover {
	color:#FFF;
}
*/

#menuContainer p.link {
	margin:6px 12px 0 0;
	padding:0;
	float:right;
	font-size:14px;
	letter-spacing:-1px;
	border-bottom:1px solid #000;
}

#menuContainer #linkContainer {
	margin:0 0 15px 0;
}

#menuContainer p.highlight {
	width:10px;
	height:10px;
	position:absolute;
	top:110px;
	background-color:#FFF;
	z-index:0;
	display:none;
}

#loadMessage {
	position:absolute;
	top:4px;
	right:4px;
	color:000;
	display:none;
}

#aboutBlock {
	left:12px;
}

#factsBlock {
	left:51px;
}

#pressBlock {
	left:93px;
}

#takeActionBlock {
	left:149px;
}


#modalContainer {
	width:896px;
	height:768px;
	position:absolute;
	top:0px;
	left:0px;
	z-index:19;
	background-color:#000;
	filter:alpha(opacity=0);
	opacity:0;
	display:none;
	cursor:pointer;
}

#notificationContainer {
	width:320px;
	/*
		Setting a height makes this look awkward, leave it up to the content and margins.
	*/
	/*
	height:128px;
	*/
	position:absolute;

	/* 
		Positions are multiples of 16 so as to line up with
		revealed area on the image.
	*/
	
	top:352px;
	left:320px;
	z-index:20;
	background-color:#797979;
	filter:alpha(opacity=90);
	opacity:.90;
	color:#FFF;
	display:none;
}

#notificationText {
	font-size:18px;
}

#tableSpacer {
	margin:50px 0;
	width:16px;
	height:380px;
	border-left:1px solid #d6d6d6;
}

#contentContainer {
	padding:16px 0 5px 16px;
}

#contentContainer.copy p {
	margin:0 0 10px 0;
}

#dialogContainer {
	margin:0;
	width:512px;
	height:480px;
	position:absolute;

	top:160px;
	left:256px;
	z-index:20;
	background-color:#797979;
	filter:alpha(opacity=90);
	opacity:.90;
	color:#FFF;
	display:none;
}

#dialogContainer h2 {
	margin:0 0 20px 0;
	padding:0;
	font-weight:normal;
	letter-spacing:-1px;
	word-spacing:-1px;
}

#closeButton {
	margin:0;
	padding:0;
	width:20px;
	height:20px;
	position:absolute;
	top:4px;
	right:4px;
	cursor:pointer;
}

#closeButton p {
	margin:0;
	padding:0;
	width:20px;
	height:20px;
}

#dialogContainer input, #dialogContainer select, #dialogContainer option {
	font-size:11px;
}

#entryTag input, #entryTag select, #entryTag option {
	font-size:11px;
}

#contentContainer h2 {
	margin:0 0 16px 0;
	padding:0;
	letter-spacing:-1px;
}

#dialogContainer p {
	line-height:14px;
	word-spacing:-1px;
}

/*
#contentContainer a {
	color:#00E9C1;
}
*/

/*
#contentContainer a:hover {
	color:#FFF;
}
*/

#dialogContainer div.content, #notificationContainer div.content {
	margin:0;
	padding:15px 35px;
}

#dialogContainer select {
	font-size:12px;
	font-family:Arial, Helvetica, sans-serif;
}


#about {
	display:none;
}

#about p {
	margin:0 0 10px 0;
}

#facts {
	display:none;
}

#press {
	display:none;
}

#press p.link {
}

#press p.date {
	margin:2px 0 6px 4px;
	padding:0;
}

#takeAction {
	background-image:url(../images/cluster1.jpg);
	background-position:642px 308px;
	background-repeat:no-repeat;
}

#takeAction p.sig {
	margin:0;
	padding:0;
	width:300px;
	overflow:hidden;
	white-space:nowrap;
}

#takeAction input[type="text"] {
	width:143px;
}

#takeAction #fccTextContainer {
	margin:15px 0 0 0;
	padding:0 10px;
	height:100px;
	overflow-y:scroll;
	font-size:11px;
}

#takeAction #fccTextContainer p {
	margin:0 0 5px 0;
}

#takeAction #fccTextArea {
	width:550px;
	height:250px;
	overflow-y:auto;
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
}

#takeAction td.text {
}